<template>
	<view style="padding-bottom: 180upx;">

		<view class="bg margin-lr radius margin-top-sm flex padding">
			<image :src="orderList.fixedClassImg" style="width: 149upx;height: 149upx;border-radius: 8upx;"></image>
			<view class="margin-left-sm  ">
				<view class="flex align-center justify-between text-lg text-bold " style="width: 470upx;">
					<view class="  ">{{orderList.serviceName}}</view>
					<view style="color: #557EFD;" v-if="orderList.taskType==1">悬赏￥
						<text v-if="orderList.paySumMoney">{{orderList.paySumMoney}}</text>
						<text v-else>{{orderList.money}}</text>
					</view>
					<view style="color: #557EFD;" v-if="orderList.taskType==3">一口价￥
						<text v-if="orderList.paySumMoney">{{orderList.paySumMoney}}</text>
						<text v-else>{{orderList.money}}</text>
					</view>
					<view style="color: #557EFD;" v-if="orderList.taskType==4">师傅任务
						<text class="text-sm">￥</text>
						<text v-if="orderList.paySumMoney">{{orderList.paySumMoney}}</text>
						<text v-else>{{orderList.money}}</text>
					</view>
				</view>
				<view class="margin-tb-xs" style="color: #999999;">{{orderList.fixedClassifyName}}</view>
				<view v-if="orderList.deliveryTime">预约时间：{{orderList.deliveryTime}}</view>
			</view>
		</view>

		<view class="bg margin-lr radius margin-top-sm padding" v-if="orderList">
			<view>服务内容</view>
			<view class="margin-top">{{orderList.content?orderList.content:'暂无'}}</view>

			<view class="flex flex-wrap">
				<view v-for="(ite,ind) in orderList.image" :key="ind" class="margin-top margin-right-sm"
					@click="saveImg(orderList.image,ind)">
					<image :src="ite" style="width: 160upx; height: 160upx;border-radius: 5upx;"></image>
				</view>
			</view>
		</view>

		<view class="flex align-center justify-between bg margin padding radius" v-if="orderList.name"
			@tap="bindGps(orderList.latitude,orderList.longitude,orderList.detailsAddress)">
			<view>
				<view class="text-lg text-bold margin-bottom-xs">{{orderList.name}} {{orderList.mobie}}</view>
				<view style="color: #999999;"> {{orderList.detailsAddress}}</view>
			</view>
			<!-- <image src=".../../static/images/index/right.png" style="width: 15upx;height: 28upx;"></image> -->
		</view>

		<view class="bg margin-lr radius margin-top-sm padding"
			v-if="(orderList.status == 3||orderList.status == 4||orderList.status == 2)&&orderList.taskType!=2">
			<view class="flex ">
				<view>联系接单人</view>
				<!-- <view style="color: #557EFD;text-align: right;">{{orderList.helpTake.createTime}}</view> -->
			</view>
			<view class="flex margin-top-sm">
				<view>
					<image :src="orderList.helpTake.user.avatar?orderList.helpTake.user.avatar:'../../static/logo.png'"
						style="width: 88upx;height: 88upx;border-radius: 50upx;"></image>
				</view>
				<view class="margin-left-xs flex align-center justify-between" style="width: 550upx;">
					<view>{{orderList.helpTake.user.userName}}</view>
					<view class="flex align-center justify-between">
						<u-icon name="chat" size="40" color="#557EFD" class="margin-right-sm"
							@click="goMsg(orderList.helpTake.user.userId,orderList.helpTake.user.userName)"></u-icon>
						<u-icon @click="bindphone(orderList.helpTake.user.shopPhone)" name="phone" size="40"
							color="#557EFD" class="margin-right-sm"></u-icon>
					</view>
				</view>
			</view>
		</view>

		<view class="bg margin-lr radius margin-top-sm padding-tb-sm padding-lr"
			v-for="(item,index) in orderList.biddingList" v-if="orderList.taskType==2&&orderList.biddingList">
			<view class="flex margin-top-sm">
				<view>
					<image :src="item.avatar?item.avatar:'../../static/logo.png'"
						style="width: 88upx;height: 88upx;border-radius: 50upx;"></image>
				</view>
				<view class="margin-left-xs" style="width: 100%;">
					<view>{{item.userName}}</view>
					<view class="flex align-center justify-between">
						<view class="wensheng text-cut">联系电话：{{maskPhoneNumber(item.phone)}}</view>
						<view class="flex align-center">
							<view @click.stop="goMsg(item.userId,item.userName)">
								<image src="../static/xiaoxi.png" style="width: 60upx;height: 60upx;"></image>
							</view>
							<view @click.stop="bindphone(item.phone)">
								<image src="../static/phone.png" style="width: 60upx;height: 60upx;margin-left: 25upx;">
								</image>
							</view>
						</view>
					</view>
				</view>
			</view>
			<view class="margin-tb-xs" style="width: 100%;height: 1rpx;background: #f5f5f5;"></view>
			<view class="flex align-center justify-between padding-tb-xs">
				<view class="text-lg text-bold" style="color: #557EFD;">
					报价：{{item.offerMoney}}
				</view>
				<view class="guyongBtn" v-if="orderList.status==1" @click="orderPay(item.biddingId,item.offerMoney)">
					雇佣TA</view>
			</view>
		</view>

		<view class="bg padding radius margin-top margin-lr" v-if="orderList.status==3||orderList.status==4">
			<view class="text-lg text-bold margin-bottom">服务前照片</view>
			<view class="flex flex-wrap justify-between">
				<view class="flex margin-bottom-sm"
					style="width: 48%;height: 200rpx;margin-right: 5rpx;position: relative;"
					v-for="(image,index) in orderList.helpTake.startTaskImg" :key="index"
					@click="saveImg(orderList.helpTake.startTaskImg,index)">
					<image :src="image" style="width: 100%;height: 100%;border-radius: 10upx;" mode="aspectFill">
					</image>
				</view>
			</view>
		</view>
		<view class="bg padding radius margin-top margin-lr" v-if="orderList.status==4">
			<view class="text-lg text-bold margin-bottom">服务后照片</view>
			<view class="flex flex-wrap justify-between">
				<view class="flex margin-bottom-sm"
					style="width: 48%;height: 200rpx;margin-right: 5rpx;position: relative;"
					v-for="(image,index) in orderList.helpTake.endTaskImg" :key="index"
					@click="saveImg( orderList.helpTake.endTaskImg,index)">
					<image :src="image" style="width: 100%;height: 100%;border-radius: 10upx;" mode="aspectFill">
					</image>
				</view>
			</view>
		</view>

		<view class="bg margin-lr radius margin-top-sm padding">
			<view class="text-lg text-bold">订单信息</view>

			<view class="flex justify-between align-center margin-top" v-if="orderList.remarks">
				<view>商家备注</view>
				<view>{{orderList.remarks}}</view>
			</view>
			
			<view class="flex justify-between align-center margin-top" v-if="orderList.taskType==2">
				<view>期望价格</view>
				<view>{{orderList.money}}元</view>
			</view>
			<view class="flex justify-between margin-top-lg" v-if="orderList.refundSumMoney">
				<view class="text-bold" style="width: 140upx;">退款总金额 </view>
				<view  class="text-white">{{orderList.refundSumMoney}}元</view>
			</view>
			<view class="flex justify-between margin-top-lg" v-if="orderList.paySumMoney">
				<view class="text-bold" style="width: 140upx;">支付总金额 </view>
				<view  class="text-white">{{orderList.paySumMoney}}元</view>
			</view>
			<view class="flex justify-between align-center margin-top" v-if="orderList.taskType==2">
				<view>报价人数</view>
				<view>{{orderList.maxPeople}}人</view>
			</view>
			<view class="flex justify-between align-center margin-top">
				<view>下单时间</view>
				<view>{{orderList.createTime}}</view>
			</view>
			<view class="flex justify-between align-center margin-top" v-if="orderList.orderNo">
				<view>订单编号</view>
				<view @click="copyOrder(orderList.orderNo)">{{orderList.orderNo}}
					<u-icon name="order"></u-icon>
				</view>
			</view>
		</view>

		<view class="tabber"
			v-if="orderList.status == 2||orderList.status == 5||orderList.status == 3||orderList.status == 4||orderList.status == 0">
			<view class="btn" v-if="orderList.status == 0" @click.stop="showPay2=true">支付</view>
			<view class="btn" v-if="orderList.status == 2" @click.stop="cancelOrder(orderList)">取消订单</view>
			<view class="btn" v-if="orderList.status == 5" @click.stop="deteOrder(orderList)">删除订单</view>
			<view class="btn" v-if="orderList.status == 3" @click.stop="openCode(orderList)">查看确认码</view>
			<view class="btn " style="margin-left:30rpx" v-if="orderList.status ==3" @click="openMoney">补费</view>
		</view>
		<u-popup v-model="showMoney" mode="center" border-radius="14" :closeable="true" width="650" height="380rpx">
			<view class="padding-top" style="width: 100%;text-align: center;font-size:38rpx;font-weight: bold;">
				补费金额
			</view>
			<view class="margin-lr padding-lr margin-top-xl" style="background: #f5f5f5;margin-bottom: 50rpx;">
				<u-input v-model="money" placeholder="请输入补费金额" type="number" />
			</view>
			<view
				style="width: 600rpx;height: 80rpx;background:#557EFD;color:#FFFFFF;text-align: center;line-height: 80rpx;border-radius: 18rpx;margin: 30rpx;"
				@tap="openPay()">确认支付</view>
		</u-popup>

		<u-popup v-model="show" mode="center" width="500rpx" height="190px" border-radius="14" :closeable="true">
			<view class="padding-lr" style="margin-top: 30upx;">
				<view class="text-lg text-bold margin-bottom">确认码</view>
				<view class="margin-top-xl padding-top text-center text-bold" style="font-size: 48upx;">{{codes}}</view>
			</view>
		</u-popup>

		<u-popup v-model="showPay" mode="bottom" border-radius="14" :closeable="true">
			<view
				style="width: 100%;text-align: center;font-size:38rpx;font-weight: bold;margin-top:15rpx;margin-bottom: 80rpx;">
				选择支付方式
			</view>
			<view style="display: flex;height: 100upx;align-items: center;padding: 20upx 30rpx;"
				v-for="(item,index) in openLists" :key='index'>
				<view style="display: flex;width:80%;align-items: center;">
					<image :src="item.image" style="width: 55upx;height: 55upx;border-radius: 50upx;"></image>
					<view style="font-size: 30upx;margin-left: 20upx;width: 70%;">{{item.text}}
					</view>
				</view>
				<view style="width: 20%;display: flex;justify-content: flex-end;">
					<radio-group name="openWay" style="margin-left: 20upx;" @tap='selectWay(item.id)'>
						<label class="tui-radio">
							<radio color="#1789FD" :checked="openWay === item.id ? true : false" />
						</label>
					</radio-group>
				</view>
			</view>
			<view
				style="width: 690rpx;height: 80rpx;background:#557EFD;color:#FFFFFF;text-align: center;line-height: 80rpx;border-radius: 50rpx;margin: 30rpx;"
				@tap="pay()">确认支付</view>
		</u-popup>

		<u-popup v-model="showPay1" mode="bottom" border-radius="14" :closeable="true">
			<view
				style="width: 100%;text-align: center;font-size:38rpx;font-weight: bold;margin-top:15rpx;margin-bottom: 80rpx;">
				选择支付方式
			</view>
			<view style="display: flex;height: 100upx;align-items: center;padding: 20upx 30rpx;"
				v-for="(item,index) in openLists" :key='index'>
				<view style="display: flex;width:80%;align-items: center;">
					<image :src="item.image" style="width: 55upx;height: 55upx;border-radius: 50upx;"></image>
					<view style="font-size: 30upx;margin-left: 20upx;width: 70%;">{{item.text}}
					</view>
				</view>
				<view style="width: 20%;display: flex;justify-content: flex-end;">
					<radio-group name="openWay" style="margin-left: 20upx;" @tap='selectWay(item.id)'>
						<label class="tui-radio">
							<radio color="#1789FD" :checked="openWay === item.id ? true : false" />
						</label>
					</radio-group>
				</view>
			</view>
			<view
				style="width: 690rpx;height: 80rpx;background:#557EFD;color:#FFFFFF;text-align: center;line-height: 80rpx;border-radius: 50rpx;margin: 30rpx;"
				@tap="pay1()">确认支付</view>
		</u-popup>
		<u-popup v-model="showPay2" mode="bottom" border-radius="14" :closeable="true">
			<view
				style="width: 100%;text-align: center;font-size:38rpx;font-weight: bold;margin-top:15rpx;margin-bottom: 80rpx;">
				选择支付方式
			</view>
			<view style="display: flex;height: 100upx;align-items: center;padding: 20upx 30rpx;"
				v-for="(item,index) in openLists" :key='index'>
				<view style="display: flex;width:80%;align-items: center;">
					<image :src="item.image" style="width: 55upx;height: 55upx;border-radius: 50upx;"></image>
					<view style="font-size: 30upx;margin-left: 20upx;width: 70%;">{{item.text}}
					</view>
				</view>
				<view style="width: 20%;display: flex;justify-content: flex-end;">
					<radio-group name="openWay" style="margin-left: 20upx;" @tap='selectWay(item.id)'>
						<label class="tui-radio">
							<radio color="#1789FD" :checked="openWay === item.id ? true : false" />
						</label>
					</radio-group>
				</view>
			</view>
			<view
				style="width: 690rpx;height: 80rpx;background:#557EFD;color:#FFFFFF;text-align: center;line-height: 80rpx;border-radius: 50rpx;margin: 30rpx;"
				@tap="pay2()">确认支付</view>
		</u-popup>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				paySel: false,
				helpOrderId: '',
				orderList: [],
				show: false,
				codes: '',
				showPay: false,
				openWay: 0,
				openLists: [],
				biddingId: '',
				showPay1: false,
				showMoney: false,
				money: '',
				showPay2: false
			}

		},
		onLoad(option) {

			this.helpOrderId = option.id
			if (this.helpOrderId) {
				this.getorderlist()
			}

			// #ifdef APP-PLUS
			this.openLists = [{
				image: '../../static/images/zhifubao.png',
				text: '支付宝',
				id: 1
			}, {
				image: '../../static/images/icon_weixin.png',
				text: '微信',
				id: 2
			}, {
				image: '../../static/images/lingqian.png',
				text: '零钱',
				id: 3
			}];
			this.openWay = 1;
			// #endif

			// #ifdef MP-WEIXIN
			this.openLists = [{
				image: '../../static/images/icon_weixin.png',
				text: '微信',
				id: 2
			}, {
				image: '../../static/images/lingqian.png',
				text: '零钱',
				id: 3
			}];
			this.openWay = 2;
			// #endif

			// #ifdef H5
			this.openLists = [{
				image: '../../static/images/zhifubao.png',
				text: '支付宝',
				id: 1
			}, {
				image: '../../static/images/lingqian.png',
				text: '零钱',
				id: 3
			}];
			this.openWay = 1;
			// #endif
		},
		methods: {
			//加密中间四位
			maskPhoneNumber(phoneNumber) {
				// 将手机号码转换为字符串类型，并根据其长度确定要替换的位数
				if (phoneNumber) {
					phoneNumber = phoneNumber.toString() //先强制转换成字符串类型
					return phoneNumber.replace(/^(\d{3})\d{4}(\d{4})$/, '$1****$2')
				}

			},
			selectWay: function(id) {
				this.openWay = id;
			},
			goMsg(byUserId, byUserName) {
				let token = this.$queue.getData('token');
				let userId = this.$queue.getData('userId');
				if (token) {
					let data = {
						userId: userId,
						focusedUserId: byUserId,
						userType: 1
					}
					this.$Request.postJson('/app/chat/insertChatConversation ', data).then(res => {
						if (res.code == 0) {
							let id = byUserId == res.data.userId ? res.data.focusedUserId : byUserId
							uni.navigateTo({
								url: '/pages/msg/chat?chatConversationId=' + res.data
									.chatConversationId +
									'&byUserId=' + byUserId + '&byNickName=' + byUserName
							})
						}
					})
				} else {
					uni.navigateTo({
						url: '/pages/public/login'
					});
				}
			},
			copyOrder(order) {
				let that = this;
				uni.setClipboardData({
					data: order,
					success: function() {
						that.$queue.showToast('复制成功')
					}
				})
			},
			// 跳转店铺
			shop(userId) {
				uni.navigateTo({
					url: '/pages/index/game/shop?shopUserId=' + userId
				})
			},
			getorderlist() {
				uni.showLoading({
					title: '加载中...',
					icon: 'none'
				});
				let data = {
					helpOrderId: this.helpOrderId,
				}
				this.$Request.get("/app/help/selectHelpOrderDetails", data).then(res => {
					uni.hideLoading();
					if (res.code == 0) {
						this.orderList = res.data

						if (this.orderList.serviceName) {
							this.orderList.serviceName = this.orderList.serviceName.split('/')
							this.orderList.serviceName = this.orderList.serviceName[0]
						}
						if (this.orderList.image) {
							this.orderList.image = this.orderList.image.split(',')
						}
						if (this.orderList.phone) {
							let mobie = this.orderList.phone
							this.orderList.mobie = mobie.substring(0, 3) + "****" + mobie.substring(
								7)
						}
						if (this.orderList.helpTake && this.orderList.helpTake.startTaskImg) {
							this.orderList.helpTake.startTaskImg = this.orderList.helpTake.startTaskImg.split(',')
						}
						if (this.orderList.helpTake && this.orderList.helpTake.endTaskImg) {
							this.orderList.helpTake.endTaskImg = this.orderList.helpTake.endTaskImg.split(',')
						}


					}
				});
			},
			// 确认码弹框
			openCode(e) {
				this.codes = e.code
				this.show = true

			},
			// 查看图片
			saveImg(imgs, index) {
				if (this.LBSelect) {
					if (index == this.LBIndex - 1) {
						return;
					}
				}
				// console.log(imgs)
				let that = this;
				let imgArr = imgs
				// imgArr.push(imgs);
				// //预览图片
				uni.previewImage({
					urls: imgArr,
					current: imgArr[index]
				});
			},
			// 一键导航
			bindGps(latitude, longitude, name) {
				uni.openLocation({
					latitude: latitude - 0, //要去的纬度-地址       
					longitude: longitude - 0, //要去的经度-地址
					name: name, //地址名称
					address: name, //详细地址名称
					success: function() {
						console.log('导航成功');
					},
					fail: function(error) {
						console.log(error)
					}
				});
			},
			// 拨打电话
			bindphone(phone) {
				let that = this

				// uni.showModal({
				// 	title: '提示',
				// 	content: '是否拨打电话',
				// 	success: function(res) {
				// 		if (res.confirm) {
				// 			console.log('用户点击确定', that.phone);
				// 			uni.makePhoneCall({
				// 				phoneNumber: phone //仅为示例
				// 			});
				// 		} else if (res.cancel) {
				// 			console.log('用户点击取消');
				// 		}
				// 	}
				// });
				uni.makePhoneCall({
					phoneNumber: phone //仅为示例
				});
			},
			// 取消订单
			cancelOrder(e) {
				let that = this
				uni.showModal({
					title: '提示',
					content: '确定取消订单吗？',
					success: function(res) {
						if (res.confirm) {
							let data = {
								helpOrderId: e.id
							}
							that.$Request.post('/app/help/outHelpOrder', data).then(res => {
								if (res.code == 0) {
									uni.navigateBack()
								} else {
									uni.showToast({
										title: res.msg,
										icon: 'none'
									})
								}
							})
						}
					},
				})

			},
			// 删除订单
			deteOrder(e) {
				let that = this
				uni.showModal({
					title: '提示',
					content: '确定删除订单吗？',
					success: function(res) {
						if (res.confirm) {
							let data = {
								helpOrderId: e.id
							}
							that.$Request.post('/app/help/deleteHelpOrder', data).then(res => {
								if (res.code == 0) {
									uni.navigateBack()
								}
							})
						}
					},
				})
			},
			orderPay(biddingId, offerMoney) {
				this.biddingId = biddingId
				this.commission = offerMoney
				this.showPay = true
			},
			pay() {
				if (this.paySel) {
					return;
				}
				let that = this
				that.paySel = true;
				that.showPay = false;
				uni.showModal({
					title: '付款提示',
					content: '确认支付' + that.commission + '元吗?',
					success: function(re) {
						if (re.confirm) {
							if (that.openWay == 2) { //微信
								// #ifdef MP-WEIXIN
								let data = {
									relationId: that.biddingId,
									orderId: that.orderList.id,
									classify: 3
								}
								that.$Request.post("/app/wxPay/wxPayHelpOrder", data).then(red => {
									console.log(red)
									if (red.code == 0) {
										uni.requestPayment({
											provider: 'wxpay',
											timeStamp: red.data.timestamp,
											nonceStr: red.data.noncestr,
											package: red.data.package,
											signType: red.data.signType,
											paySign: red.data.sign,
											success: function(redd) {
												that.paySel = false;
												uni.removeStorageSync('EditAddress')
												uni.showLoading({
													title: '支付成功'
												});
												uni.hideLoading();
												setTimeout(function() {
													uni.redirectTo({
														url: '/my/renwu/index'
													})

												}, 1000)
											},
											fail: function(err) {
												that.paySel = false;
												uni.hideLoading();
												that.$queue.showToast(
													'支付失败');
											}
										});
									} else {
										that.paySel = false;
										uni.showToast({
											title: red.msg,
											icon: 'none'
										})
									}
								});
								// #endif
								// #ifdef APP
								let data = {
									relationId: that.biddingId,
									orderId: that.orderList.id,
									classify: 1
								}
								that.$Request.post("/app/wxPay/wxPayHelpOrder", data).then(red => {
									console.log(red)
									if (red.code == 0) {
										that.setPayment('wxpay', JSON.stringify(red.data));
									} else {
										that.paySel = false;
										uni.showToast({
											title: red.msg,
											icon: 'none'
										})
									}
								});
								// #endif
								// #ifdef H5
								let data = {
									relationId: that.biddingId,
									orderId: that.orderList.id,
									classify: 2
								}
								that.$Request.post("/app/wxPay/wxPayHelpOrder", data).then(red => {
									console.log(red)
									if (red.code == 0) {
										that.callPay(red);
									} else {
										that.paySel = false;
										uni.showToast({
											title: red.msg,
											icon: 'none'
										})
									}
								});
								// #endif
							} else if (that.openWay == 1) { //支付宝
								// #ifdef APP
								let data = {
									relationId: that.biddingId,
									orderId: that.orderList.id,
									classify: 4
								}
								that.$Request.post("/app/aliPay/payHelpOrder", data).then(red => {
									if (red.code == 0) {
										that.setPayment('alipay', red.data);
									} else {
										that.paySel = false;
										uni.showToast({
											title: red.msg,
											icon: 'none'
										})
									}
								});
								// #endif

								// #ifdef H5
								let data = {
									relationId: that.biddingId,
									orderId: that.orderList.id,
									classify: 5
								}
								that.$Request.post("/app/aliPay/payHelpOrder", data).then(red => {
									if (red.code == 0) {
										that.paySel = false;
										const div = document.createElement('div')
										div.innerHTML = red.data //此处form就是后台返回接收到的数据
										document.body.appendChild(div)
										document.forms[0].submit()
									} else {
										that.paySel = false;
										uni.showToast({
											title: red.msg,
											icon: 'none'
										})
									}
								});
								// #endif
							} else if (that.openWay == 3) { //零钱
								let data = {
									orderId: that.orderList.id,
									biddingId: that.biddingId
								}
								that.$Request.post("/app/help/choiceBidding", data).then(ret => {
									if (ret.code == 0) {
										uni.showToast({
											title: '支付成功',
											icon: 'none'
										})
										that.paySel = false;
										setTimeout(function() {
											uni.redirectTo({
												url: '/my/renwu/index'
											})
										}, 1000)

									} else {
										that.paySel = false;
										uni.showToast({
											title: ret.msg,
											icon: 'none'
										})
									}
								});
							}
						} else if (re.cancel) {
							that.paySel = false;
							uni.redirectTo({
								url: '/my/renwu/index'
							})
						}
					}
				})
			},
			openMoney() {
				this.money = ''
				this.showMoney = true
			},
			openPay() {
				let that = this
				if (!that.money) {
					uni.showToast({
						title: '请输入补费金额',
						icon: 'none'
					})
					return
				}
				if (Number(that.money) <= 0) {
					uni.showToast({
						title: '补费金额不能小于0',
						icon: 'none'
					})
					return
				}
				that.showMoney = false
				that.showPay1 = true
			},
			// 支付补费
			pay1() {
				if (this.paySel) {
					return;
				}
				let that = this
				that.paySel = true;
				that.showPay1 = false
				uni.showModal({
					title: '付款提示',
					content: '确认支付' + that.money + '元吗?',
					success: function(re) {
						if (re.confirm) {
							//classify  1app  2公众号 3小程序
							let classify = 1;
							if (that.openWay == 2) { //微信
								// #ifdef MP-WEIXIN
								that.$Request.post("/app/orders/repairFee", {
									ordersId: that.orderList.id,
									payType: 3,
									money: that.money,
									orderType: 1
								}).then(red => {
									if (red.code == 0) {
										uni.requestPayment({
											provider: 'wxpay',
											timeStamp: red.data.timestamp,
											nonceStr: red.data.noncestr,
											package: red.data.package,
											signType: red.data.signType,
											paySign: red.data.sign,
											success: function(redd) {
												that.paySel = false;
												uni.removeStorageSync('EditAddress')
												uni.showLoading({
													title: '支付成功'
												});
												uni.hideLoading();
												setTimeout(function() {
													// uni.redirectTo({
													// 	url: '/my/renwu/index'
													// })
													that.getorderlist()
												}, 10)
											},
											fail: function(err) {
												that.paySel = false;
												uni.hideLoading();
												that.$queue.showToast(
													'支付失败');
											}
										});
									} else {
										that.paySel = false;
										uni.showToast({
											title: red.msg,
											icon: 'none'
										})
									}
								});
								// #endif

								// #ifdef H5
								that.$Request.post("/app/orders/repairFee", {
									ordersId: that.orderList.id,
									payType: 2,
									money: that.money,
									orderType: 1
								}).then(red => {
									if (red.code == 0) {
										that.callPay(red);
									} else {
										that.paySel = false;
										uni.showToast({
											title: red.msg,
											icon: 'none'
										})
									}
								});
								// #endif

								// #ifdef APP-PLUS
								that.$Request.post("/app/orders/repairFee", {
									ordersId: that.orderList.id,
									payType: 1,
									money: that.money,
									orderType: 1
								}).then(red => {
									if (red.code == 0) {
										console.log(JSON.stringify(red))
										that.setPayment('wxpay', JSON.stringify(red.data));
									} else {
										that.paySel = false;
										uni.showToast({
											title: red.msg,
											icon: 'none'
										})
									}
								});
								// #endif

							} else if (that.openWay == 1) { //支付宝
								// #ifdef H5
								that.$Request.post("/app/orders/repairFee", {
									ordersId: that.orderList.id,
									payType: 5,
									money: that.money,
									orderType: 1
								}).then(red => {
									if (red.code == 0) {
										that.paySel = false;
										const div = document.createElement('div')
										div.innerHTML = red.data //此处form就是后台返回接收到的数据
										document.body.appendChild(div)
										document.forms[0].submit()
									} else {
										that.paySel = false;
										uni.showToast({
											title: red.msg,
											icon: 'none'
										})
									}
								});
								// #endif
								// #ifdef APP-PLUS
								that.$Request.post("/app/orders/repairFee", {
									ordersId: that.orderList.id,
									payType: 4,
									money: that.money,
									orderType: 1
								}).then(red => {
									if (red.code == 0) {
										that.setPayment('alipay', red.data);
									} else {
										that.paySel = false;
										uni.showToast({
											title: red.msg,
											icon: 'none'
										})
									}
								});
								// #endif
							} else if (that.openWay == 3) { //零钱
								that.$Request.post("/app/orders/repairFee", {
									ordersId: that.orderList.id,
									payType: 0,
									money: that.money,
									orderType: 1
								}).then(res => {
									if (res.code == 0) {
										that.paySel = false;
										uni.showToast({
											title: '支付成功'
										})
										setTimeout(function() {
											// uni.redirectTo({
											// 	url: '/my/renwu/index'
											// })
											that.getorderlist()
										}, 10)
									} else {
										that.paySel = false;
										uni.showToast({
											title: res.msg,
											icon: 'none'
										})
									}
								});
							}

						} else if (re.cancel) {
							that.paySel = false;
							console.log('用户点击取消');
						}
					}

				})

			},
			pay2() { //待付款支付
				if (this.paySel) {
					return;
				}
				let that = this
				that.paySel = true;
				that.showPay2 = false;
				uni.showModal({
					title: '付款提示',
					content: '确认支付' + that.orderList.commission + '元吗?',
					success: function(re) {
						if (re.confirm) {
							if (that.openWay == 2) { //微信
								// #ifdef MP-WEIXIN
								let data = {
									orderId: that.orderList.id,
									classify: 3
								}
								that.$Request.post("/app/wxPay/wxPayHelpOrder", data).then(red => {
									console.log(red)
									if (red.code == 0) {
										uni.requestPayment({
											provider: 'wxpay',
											timeStamp: red.data.timestamp,
											nonceStr: red.data.noncestr,
											package: red.data.package,
											signType: red.data.signType,
											paySign: red.data.sign,
											success: function(redd) {
												that.paySel = false;
												uni.removeStorageSync('EditAddress')
												uni.showLoading({
													title: '支付成功'
												});
												uni.hideLoading();
												setTimeout(function() {
													// uni.redirectTo({
													// 	url: '/my/renwu/index'
													// })
													that.getorderlist()
												}, 100)
											},
											fail: function(err) {
												that.paySel = false;
												uni.hideLoading();
												that.$queue.showToast(
													'支付失败');
											}
										});
									} else {
										that.paySel = false;
										uni.showToast({
											title: red.msg,
											icon: 'none'
										})
									}
								});
								// #endif
								// #ifdef APP
								let data = {
									orderId: that.orderList.id,
									classify: 1
								}
								that.$Request.post("/app/wxPay/wxPayHelpOrder", data).then(red => {
									console.log(red)
									if (red.code == 0) {
										that.setPayment('wxpay', JSON.stringify(red.data));
									} else {
										that.paySel = false;
										uni.showToast({
											title: red.msg,
											icon: 'none'
										})
									}
								});
								// #endif
								// #ifdef H5
								let data = {
									orderId: that.orderList.id,
									classify: 2
								}
								that.$Request.post("/app/wxPay/wxPayHelpOrder", data).then(red => {
									console.log(red)
									if (red.code == 0) {
										that.callPay(red);
									} else {
										that.paySel = false;
										uni.showToast({
											title: red.msg,
											icon: 'none'
										})
									}
								});
								// #endif
							} else if (that.openWay == 1) { //支付宝
								// #ifdef APP
								let data = {
									orderId: that.orderList.id,
									classify: 2
								}
								that.$Request.post("/app/aliPay/payHelpOrder", data).then(red => {
									if (red.code == 0) {
										that.setPayment('alipay', red.data);
									} else {
										that.paySel = false;
										uni.showToast({
											title: red.msg,
											icon: 'none'
										})
									}
								});
								// #endif

								// #ifdef H5
								let data = {
									orderId: that.orderList.id,
									classify: 1
								}
								that.$Request.post("/app/aliPay/payHelpOrder", data).then(red => {
									if (red.code == 0) {
										that.paySel = false;
										const div = document.createElement('div')
										div.innerHTML = red.data //此处form就是后台返回接收到的数据
										document.body.appendChild(div)
										document.forms[0].submit()
									} else {
										that.paySel = false;
										uni.showToast({
											title: red.msg,
											icon: 'none'
										})
									}
								});
								// #endif
							} else if (that.openWay == 3) { //零钱
								let data = {
									ordersId: that.orderList.id,
								}
								that.$Request.post("/app/help/payMoney", data).then(ret => {
									if (ret.code == 0) {
										uni.showToast({
											title: '支付成功',
											icon: 'none'
										})
										that.paySel = false;
										setTimeout(function() {
											// uni.redirectTo({
											// 	url: '/my/renwu/index'
											// })
											that.getorderlist()
										}, 10)

									} else {
										that.paySel = false;
										uni.showToast({
											title: ret.msg,
											icon: 'none'
										})
									}
								});
							}
						} else if (re.cancel) {
							that.paySel = false;
							uni.redirectTo({
								url: '/my/renwu/index'
							})
						}
					}
				})
			},
			callPay: function(response) {
				if (typeof WeixinJSBridge === "undefined") {
					if (document.addEventListener) {
						document.addEventListener('WeixinJSBridgeReady', this.onBridgeReady(response), false);
					} else if (document.attachEvent) {
						document.attachEvent('WeixinJSBridgeReady', this.onBridgeReady(response));
						document.attachEvent('onWeixinJSBridgeReady', this.onBridgeReady(response));
					}
				} else {
					this.onBridgeReady(response);
				}
			},
			onBridgeReady: function(response) {
				let that = this;
				if (!response.package) {
					return;
				}
				WeixinJSBridge.invoke(
					'getBrandWCPayRequest', {
						"appId": response.appid, //公众号名称，由商户传入
						"timeStamp": response.timestamp, //时间戳，自1970年以来的秒数
						"nonceStr": response.noncestr, //随机串
						"package": response.package,
						"signType": response.signType, //微信签名方式：
						"paySign": response.sign //微信签名
					},
					function(res) {
						if (res.err_msg === "get_brand_wcpay_request:ok") {
							that.paySel = false;
							// 使用以上方式判断前端返回,微信团队郑重提示：
							//res.err_msg将在用户支付成功后返回ok，但并不保证它绝对可靠。
							uni.showToast({
								title: '支付成功',
								icon: 'none'
							})
							setTimeout(function() {
								// uni.redirectTo({
								// 	url: '/my/renwu/index'
								// })
								that.getorderlist()
							}, 10)
						} else {
							that.paySel = false;
							uni.hideLoading();
						}
						WeixinJSBridge.log(response.err_msg);
					}
				);
			},
			setPayment(name, order) {
				let that = this;
				uni.requestPayment({
					provider: name,
					orderInfo: order, //微信、支付宝订单数据
					success: function(res) {
						that.paySel = false;
						uni.showToast({
							title: '支付成功',
							icon: 'none'
						})
						setTimeout(function() {
							// uni.redirectTo({
							// 	url: '/my/renwu/index'
							// })
							that.getorderlist()
						}, 10)
					},
					fail: function(err) {
						that.paySel = false;
						uni.hideLoading();
					}
				});
			}
		}
	}
</script>

<style>
	page {
		background: #F8F8F8;
	}

	.bg {
		background: #FFFFFF;
	}

	.box {
		flex: 1;
		text-align: center;
	}

	.active {
		background: #F2F5FF;
	}



	.btn {
		background-color: #557EFD;
		border-radius: 8upx;
		width: 90%;
		margin: 0 auto;
		color: #FFFFFF;
		text-align: center;
		padding: 25upx 0;

		/* position: fixed;
		bottom: 30upx;
		left: 0upx;
		right: 0upx; */

	}

	.lianxi {
		background: #557EFD;
		color: #FFFFFF;
		display: inline-table;
		border-radius: 8upx;
		padding: 10upx 15upx;
	}

	.tabber {
		position: fixed;
		bottom: 0upx;
		left: 0upx;
		right: 0upx;
		background: #FFFFFF;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 20upx 30upx;
	}

	.btn1 {
		width: 330upx;
		height: 78upx;
		background: #D9D9D9;
		border-radius: 16upx;
		color: #FFFFFF;
		text-align: center;
		line-height: 78upx;
	}

	.btn2 {
		width: 330upx;
		height: 78upx;
		background: #557EFD;
		border-radius: 16upx;
		color: #FFFFFF;
		text-align: center;
		line-height: 78upx;
	}

	.wensheng {
		width: 350rpx;
	}

	.guyongBtn {
		width: 120upx;
		height: 55upx;
		background: #557EFD;
		border-radius: 8upx;
		color: #FFFFFF;
		text-align: center;
		line-height: 55upx;
	}
</style>